/*
  学习目标：不可变数据
*/

import React, { Component } from 'react';

export default class App extends Component {
  state = {
    list: [1, 2, 3],
  };

  handleAdd = () => {
    // ❌ push 等会改变原始数据的方法都不能用
    // this.state.push(4)

    //✅ 新值覆盖旧值
    const newList = [...this.state.list, 4];
    this.setState({ list: newList });
  };

  render() {
    return (
      <div>
        <h1>{this.state.list}</h1>
        <button onClick={this.handleAdd}>点我变为4</button>
      </div>
    );
  }
}
